<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<c:set var="ctx" value="${pageContext.request.contextPath}" />
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<!--[if lt IE 9]>
<script type="text/javascript" src="${ctx }/resources/lib/html5.js"></script>
<script type="text/javascript" src="${ctx }/resources/lib/respond.min.js"></script>
<script type="text/javascript" src="${ctx }/resources/lib/PIE_IE678.js"></script>
<![endif]-->
<link rel="stylesheet" type="text/css" href="${ctx }/resources/css/H-ui.min.css" />
<link rel="stylesheet" type="text/css" href="${ctx }/resources/css/H-ui.admin.css" />
<link rel="stylesheet" type="text/css" href="${ctx }/resources/lib/Hui-iconfont/1.0.7/iconfont.css" />
<link rel="stylesheet" type="text/css" href="${ctx }/resources/lib/icheck/icheck.css" />
<link rel="stylesheet" type="text/css" href="${ctx }/resources/skin/default/skin.css" id="skin" />
<link rel="stylesheet" type="text/css" href="${ctx }/resources/css/style.css" />
<link rel="stylesheet" type="text/css" href="${ctx }/resources/fonts/fontawesome/font-awesome.min.css" media="all"/>
<!--[if IE 6]>
<script type="text/javascript" src="http://lib.h-ui.net/DD_belatedPNG_0.0.8a-min.js" ></script>
<script>DD_belatedPNG.fix('*');</script>
<![endif]-->
<link rel="stylesheet" type="text/css" href="${ctx }/resources/lib/dtGrid-v1.1.9/jquery.dtGrid.css" />
<title>用户列表</title>
</head>
<body>
<div class="page-container">
	<form class="form form-horizontal" id="form-add" method="post" action="${ctx }/role/save">
		<div class="row cl">
			<label class="form-label col-xs-4 col-sm-2"><span class="c-red">*</span> 角色名称：</label>
			<div class="formControls col-xs-8 col-sm-9">
				<input type="hidden" class="input-text" value="${role.roleId }" id="roleId" name="roleId">
				<input type="text" class="input-text" value="${role.roleName }" placeholder="角色名称" id="roleName" name="roleName">
			</div>
		</div>
		<div class="row cl">
			<label class="form-label col-xs-4 col-sm-2"><span class="c-red">*</span> 角色标识：</label>
			<div class="formControls col-xs-8 col-sm-9">
				<input type="text" class="input-text" value="${role.roleCode }" placeholder="角色标识" id="roleCode" name="roleCode">
			</div>
		</div>
		<div class="row cl">
			<label class="form-label col-xs-4 col-sm-2"><span class="c-red">*</span> 状态：</label>
			<div class="formControls col-xs-8 col-sm-9 skin-minimal">
				<c:choose>
					<c:when test="${role.status == 1}">
						<div class="radio-box">
							<input type="radio" id="status-1" name="status" value="0">
							<label for="status-1">激活</label>
						</div>
						<div class="radio-box">
							<input type="radio" id="status-2" name="status" value="1" checked>
							<label for="status-2">锁定</label>
						</div>
					</c:when>
					<c:otherwise>
						<div class="radio-box">
							<input type="radio" id="status-1" name="status" value="0" checked>
							<label for="status-1">激活</label>
						</div>
						<div class="radio-box">
							<input type="radio" id="status-2" name="status" value="1">
							<label for="status-2">锁定</label>
						</div>
					</c:otherwise>
				</c:choose>
			</div>
		</div>
		<div class="row cl">
			<label class="form-label col-xs-4 col-sm-2"><span class="c-red">*</span> 权限：</label>
			<div class="formControls col-xs-8 col-sm-9">
				<c:forEach items="${menuList }" var="menu">
					<dl class="permission-list">
						<dt>
							<label>
								<input type="checkbox" value="${menu.menuId }" name="menus" id="menus" <c:if test="${menu.checked eq true }">checked</c:if>> ${menu.menuName }
							</label>
						</dt>
						<c:if test="${fn:length(menu.children) > 0}">
							<dd>
								<c:forEach items="${menu.children }" var="son">
									<dl class="cl permission-list2">
										<dt>
											<label class="">
												<input type="checkbox" value="${son.menuId }" name="menus" id="menus" <c:if test="${son.checked eq true }">checked</c:if>> ${son.menuName }
											</label>
										</dt>
										<c:if test="${fn:length(son.children) > 0}">
											<dd>
												<c:forEach items="${son.children }" var="children">
													<label class="">
														<input type="checkbox" value="${children.menuId }" name="menus" id="menus" <c:if test="${children.checked eq true }">checked</c:if>> ${children.menuName }
													</label>
												</c:forEach>
											</dd>
										</c:if>
									</dl>
								</c:forEach>
							</dd>
						</c:if>
					</dl>
				</c:forEach>
			</div>
		</div>
		<div class="row cl">
			<label class="form-label col-xs-4 col-sm-2"> 角色描述：</label>
			<div class="formControls col-xs-8 col-sm-9">
				<textarea name="description" cols="" rows="" class="textarea"  placeholder="说点什么...最少输入10个字符" datatype="*10-100" dragonfly="true" nullmsg="备注不能为空！" onKeyUp="textarealength(this,200)">${account.description }</textarea>
				<p class="textarea-numberbar"><em class="textarea-length">0</em>/200</p>
			</div>
		</div>
		<div class="row cl">
			<div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-2">
				<button class="btn btn-secondary radius" type="submit"><i class="Hui-iconfont">&#xe632;</i> 保存</button>
				<button onClick="layer_close();" class="btn btn-default radius" type="button">&nbsp;&nbsp;取消&nbsp;&nbsp;</button>
			</div>
		</div>
	</form>
</div>
<script type="text/javascript" src="${ctx }/resources/lib/jquery/1.9.1/jquery.min.js"></script> 
<script type="text/javascript" src="${ctx }/resources/lib/bootstrap/bootstrap.min.js"></script>
<script type="text/javascript" src="${ctx }/resources/lib/layer/2.1/layer.js"></script> 
<script type="text/javascript" src="${ctx }/resources/lib/My97DatePicker/WdatePicker.js"></script> 
<script type="text/javascript" src="${ctx }/resources/js/H-ui.js"></script> 
<script type="text/javascript" src="${ctx }/resources/js/H-ui.admin.js"></script> 
<script type="text/javascript" src="${ctx }/resources/lib/dtGrid-v1.1.9/jquery.dtGrid.js"></script>
<script type="text/javascript" src="${ctx }/resources/lib/dtGrid-v1.1.9/i18n/zh-cn.js"></script>
<script type="text/javascript" src="${ctx }/resources/lib/jquery.validation/1.14.0/jquery.validate.js"></script>
<script type="text/javascript" src="${ctx }/resources/ams/util/util.js"></script>
<script type="text/javascript">
$(function(){
	$(".permission-list dt input:checkbox").click(function(){
		$(this).closest("dl").find("dd input:checkbox").prop("checked",$(this).prop("checked"));
	});
	$(".permission-list2 dd input:checkbox").click(function(){
		var l =$(this).parent().parent().find("input:checked").length;
		var l2=$(this).parents(".permission-list").find(".permission-list2 dd").find("input:checked").length;
		if($(this).prop("checked")){
			$(this).closest("dl").find("dt input:checkbox").prop("checked",true);
			$(this).parents(".permission-list").find("dt").first().find("input:checkbox").prop("checked",true);
		}
		else{
			if(l==0){
				$(this).closest("dl").find("dt input:checkbox").prop("checked",false);
			}
			if(l2==0){
				$(this).parents(".permission-list").find("dt").first().find("input:checkbox").prop("checked",false);
			}
		}
	});
	
	if('edit' === '${operation}'){
	} else if ('add' === '${operation}'){
	} else {
	}
	
	$("#form-add").validate({
		rules:{
			roleName:{
				required:true
			},
			roleCode:{
				required:true
			},
			status:{
				required:true
			},
			menu:{
				required:true
			}
		},
		messages:{
			roleName:{
                required:"必填"
            },
            roleCode:{
                required:"必填"
            },
            status:{
                required: "至少选择一个"
            },
            menu:{
                required: "至少选择一个"
            }                                      
        },
        submitHandler:function(form){
        	$.ajax({  
        	    url : '${ctx}/role/save',
        	    data : $("#form-add").serialize(),  
        	    type:'post',  
        	    cache:false,  
        	    dataType:'json',  
        	    success:function(data) {  
        	        if(data){  
        	        	var index = parent.layer.getFrameIndex(window.name);
        				parent.searchRows();
        				parent.layer.close(index);
        	        }else{  
        	        	layer.msg('数据保存失败，请稍后重新尝试!',{icon: 5,time:1000});
        	        }  
				},  
				error : function() { 
					layer.msg('服务器异常，请联系管理员!',{icon: 5,time:1000});
				}  
        	});
			
        }  
	});
});

</script>
</body>
</html>